.tab {
  position: fixed;
  bottom: -1px;
  left: 0;
  z-index: 10;
  width: 100%;
  height: .51rem;
  background-color: rgb(255, 255, 255);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-around;

  .tab_link1 {
    .icon {
      display: flex;
      flex-direction: row;
      width: .24rem;
      height: .24rem;
      background: url("../../../src/images/img.png") no-repeat;
      background-size: .24rem;
      background-position: 0 0;
      margin-left: 2px;
    }
    span {
      font-size: 14px;
      color: rgb(127, 127, 127);
      &:hover {
        color: rgb(132, 95, 63);;
      }
    }
    &.active {
      .icon {
        background-position: 0 11%;
      }
    }
  }

  .tab_link2 {
    .icon {
      display: flex;
      flex-direction: row;
      width: .24rem;
      height: .24rem;
      background: url("../../../src/images/img.png") no-repeat;
      background-size: .24rem;
      background-position: 0 22%;
      margin-left: 3px;
    }
    span {
      font-size: 14px;
      color: rgb(127, 127, 127);
      &:hover {
        color: rgb(132, 95, 63);;
      }
    }
    &.active {
      .icon {
        background-position: 0 33%;
      }
    }
  }

  .tab_link3 {
    .icon {
      display: flex;
      flex-direction: row;
      width: .24rem;
      height: .24rem;
      background: url("../../../src/images/img.png") no-repeat;
      background-size: .24rem;
      background-position: 0 44%;
      margin-left: 3px;
    }
    span {
      font-size: 14px;
      color: rgb(127, 127, 127);
      &:hover {
        color: rgb(132, 95, 63);;
      }
    }
    &.active {
      .icon {
        background-position: 0 55%;
      }
    }
  }

  .tab_link4 {
    .icon {
      display: flex;
      flex-direction: row;
      width: .24rem;
      height: .24rem;
      background: url("../../../src/images/img.png") no-repeat;
      background-size: .24rem;
      background-position: 0 66%;
      margin-left: 7px;
    }
    span {
      font-size: 14px;
      color: rgb(127, 127, 127);
      &:hover {
        color: rgb(132, 95, 63);;
      }
    }
    &.active {
      .icon {
        background-position: 0 77.5%;
      }
    }
  }

  .tab_link5 {
    .icon {
      display: flex;
      flex-direction: row;
      width: .24rem;
      height: .24rem;
      background: url("../../../src/images/img.png") no-repeat;
      background-size: .24rem;
      background-position: 0 89%;
      margin-left: 2px;
    }
    span {
      font-size: 14px;
      color: rgb(127, 127, 127);
      word-wrap: break-word;
      &:hover {
        color: rgb(132, 95, 63);;
      }
    }
    &.active {
      .icon {
        background-position: 0 99.5%;
      }
    }
  }
}



